<!DOCTYPE html>
<html>
	<head>
		<title></title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

		<link type="image/ico" rel="shortcut icon" href="../icons/favicon.ico">
		<link type="image/ico" rel="icon"  href="../icons/favicon.ico">

		<meta name="description" content="This story map was created with the Story Map Journal application in ArcGIS Online.">

		<style>
			.error-msg {
				padding: 40px 10px;
				text-align: center;
				font-size: 20px;
				width: 50%;
				margin: 0 auto;
				font-family: 'Georgia', 'Hoefler Text', serif;
				line-height: 1.5em;
			}

			.small-loader {
				width: 50px;
				height: 50px;
				background: url(../../../tpl/viewer/icons/loading-light.gif);
				background-size: 50px 50px;
				background-repeat: no-repeat;
				display: inline-block;
			}
		</style>

		<script>
			function loadJS(url, isExternal)
			{
				if( isExternal ) {
					url = document.location.protocol == 'file:' ? 'http:' + url : url;
				}
				else {
					url += '?v=' + app.version + (!app.isProduction ? '&_=' + new Date().getTime() : '');
				}

				var ref = window.document.getElementsByTagName('script')[0];
				var script = window.document.createElement('script');
				script.src = url;
				script.async = false;
				ref.parentNode.insertBefore(script, ref);
			}

			function loadCSS(url, isExternal)
			{
				if( isExternal )
					url = document.location.protocol == 'file:' ? 'http:' + url : url;
				else
					url += '?v=' + app.version + (!app.isProduction ? '&_=' + new Date().getTime() : '');

				var el = document.createElement("link");
				el.setAttribute("rel", "stylesheet");
				el.setAttribute("type", "text/css");
				el.setAttribute("href", url);
				document.getElementsByTagName("head")[0].appendChild(el);
			}

			function getUrlVar(name)
			{
				var vars = [], hash;
				if( window.location.href.indexOf('?') == -1 ) return null;

				var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
				for(var i = 0; i < hashes.length; i++){
					hash = hashes[i].split('=');
					hash[0] = hash[0].split('#')[0];
					vars.push(hash[0]);
					vars[hash[0]] = (hash[1] == undefined) ? true : hash[1];
				}
				return vars[name];
			}

			function loadThings() {
				if (!app) {
					var appid = getUrlVar('appid');
					var errorDiv = document.getElementsByClassName('error-msg')[0];
					if (appid) {
						errorDiv.innerHTML = 'To access the printable version of this Story Maps: <a href="../../../../index.html?appid=' + appid + '">open the story</a> and use the print button located in the share dialog.';
					}
					else {
						errorDiv.innerHTML = 'Unexpected error accessing this story map.';
					}
					return;
				}
				loadCSS(app.pathJSAPI + 'esri/css/esri.css', true);
				loadCSS(app.pathJSAPI + 'dijit/themes/claro/claro.css', true);

				loadCSS('print.css');

				loadJS(app.pathJSAPI + 'init.js', true);
				loadJS('jquery.js');

				if (! app.isProduction ) {
					window.storyURL = window.storyURL || app.data.storyURL || window.opener.location.href || 'http://localhost';
				}

				loadJS('print.js');
			}
		</script>

		<script>
			if (window.opener && window.opener.app) {
				var app = window.opener.app;
			}
			window.onload = function() {
				loadThings();
			};

		</script>
	</head>
	<body class="claro mj-print">

		<div class="error-msg">
			<div class="small-loader"></div>
		</div>
	</body>
</html>
